<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8"/>
    <link href="../static/global/plugins/font-awesome/css/font-awesome.min.css" th:href="@{/global/plugins/font-awesome/css/font-awesome.min.css}" rel="stylesheet" type="text/css" />
    <link href="../static/global/plugins/bootstrap/css/bootstrap.min.css" th:href="@{/global/plugins/bootstrap/css/bootstrap.min.css}" rel="stylesheet" type="text/css"/>
    <link href="../static/global/css/components.min.css" th:href="@{/global/css/components.min.css}" rel="stylesheet" id="style_components" type="text/css"/>
    <link href="../static/global/css/plugins.min.css" th:href="@{/global/css/plugins.min.css}" rel="stylesheet" type="text/css"/>
    <link href="../static/layouts/layout/css/layout.css" th:href="@{/layouts/layout/css/layout.css}" rel="stylesheet" type="text/css"/>
</head>
<body>
<div class="page-bar">
    <ul class="page-breadcrumb">
        <li>
            <a href="#">用户权限管理</a>
            <i class="fa fa-circle"></i>
        </li>
        <li>
            <span>操作员编辑</span>
        </li>
    </ul>
</div>

<div class="row">
    <div class="col-md-12">
        <div class="portlet box green">
            <div class="portlet-title">
                <div class="caption">
                    <i class="fa fa-gift"></i>录入框
                </div>
                <div class="tools">
                    <a href="javascript:;" class="collapse"> </a>
                </div>
            </div>
            <div class="portlet-body form">
                <form id="edit_form" class="form-horizontal" action="/user/create" method="post">
                    <div class="form-body">
                        <div class="form-group">
                            <label class="col-md-3 control-label">用户名<span class="required"> * </span></label>
                            <div class="col-md-4">
                                <input type="text" name="username" th:value="${user.username}" class="form-control"/>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-3 control-label">真实姓名<span class="required"> * </span></label>
                            <div class="col-md-4">
                                <input type="text" name="realname" th:value="${user.realname}" class="form-control"/>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-3 control-label">手机号</label>
                            <div class="col-md-4">
                                <input type="text" name="mobile" th:value="${user.mobile}" class="form-control"/>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-3 control-label">电子邮箱</label>
                            <div class="col-md-4">
                                <input type="text" name="email" th:value="${user.email}" class="form-control"/>
                            </div>
                        </div>
                        <div th:if="${op}=='create'">
                            <div class="form-group">
                                <label class="col-md-3 control-label">密码<span class="required"> * </span></label>
                                <div class="col-md-4">
                                    <input type="password" name="password" class="form-control"/>
                                </div>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-3 control-label">角色<span class="required"> * </span></label>
                            <div class="col-md-4">
                                <select  id="select2_modal" name="roleIds" class="form-control" multiple="true">
                                </select>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-3 control-label">状态<span class="required"> * </span></label>
                            <div class="col-md-4">
                                <div class="radio-list" data-error-container="#form_locked_error">
                                    <label class="radio-inline">
                                        <input type="radio" name="locked" id="lock_u" value="0"/>激活</label>
                                    <label class="radio-inline">
                                        <input type="radio" name="locked" id="lock_l" value="1"/>锁定</label>
                                </div>
                                <div id="form_locked_error"></div>
                            </div>
                        </div>
                    </div>
                    <div class="alert alert-danger display-hide">
                        <button class="close" data-close="alert"></button>
                        <span>Enter any username and password. </span>
                    </div>
                    <div class="form-actions">
                        <div class="row">
                            <div class="col-md-offset-3 col-md-9">
                                <button class="btn green" type="submit">保存</button>
                                <button class="btn default" onclick="javascript:history.back();" type="button">返回</button>                            </div>
                        </div>
                    </div>
                </form>
                <!-- END FORM-->
            </div>
        </div>
    </div>
</div>
<!-- END FOOTER -->
<!--[if lt IE 9]>
<script src="../static/global/plugins/respond.min.js" th:src="@{/global/plugins/respond.min.js}"></script>
<script src="../static/global/plugins/excanvas.min.js" th:src="@{/global/plugins/excanvas.min.js}"></script>
<script src="../static/global/plugins/ie8.fix.min.js" th:src="@{/global/plugins/ie8.fix.min.js}"></script>
<![endif]-->
<script src="../static/global/plugins/jquery.min.js" th:src="@{/global/plugins/jquery.min.js}" type="text/javascript"></script>
<script src="../static/global/plugins/bootstrap/js/bootstrap.min.js" th:src="@{/global/plugins/bootstrap/js/bootstrap.min.js}" type="text/javascript"></script>
<script src="../static/global/plugins/jquery.blockui.min.js" th:src="@{/global/plugins/jquery.blockui.min.js}" type="text/javascript"></script>
<script src="../static/global/scripts/app.js" th:src="@{/global/scripts/app.js}" type="text/javascript"></script>
<script src="../static/layouts/layout/scripts/layout.js" th:src="@{/layouts/layout/scripts/layout.js}" type="text/javascript"></script>
<script src="../static/global/plugins/jquery-validation/js/jquery.validate.min.js" th:src="@{/global/plugins/jquery-validation/js/jquery.validate.min.js}" type="text/javascript"></script>
<script src="../static/global/plugins/jquery-validation/js/additional-methods.js" th:src="@{/global/plugins/jquery-validation/js/additional-methods.js}" type="text/javascript"></script>
<script src="../static/global/plugins/jquery.form.min.js" th:src="@{/global/plugins/jquery.form.min.js}" type="text/javascript"></script>
<script src="../static/layouts/page/scripts/rbac_user_edit.js" th:src="@{/layouts/page/scripts/rbac_user_edit.js}" type="text/javascript"></script>
<script th:inline="javascript">
    /*<![CDATA[*/
    //多选列表渲染
    var sites = /*[[${sites}]]*/ null;
    var roles = /*[[${roles}]]*/ null;
    var op = [[${op}]];
    var userId = [[${user.id}]];
    for(var i=0;i<sites.length;i++){
        $("#select2_modal").append("<optgroup label=\""+sites[i].name+"\">");
        for(var j=0;j<roles.length;j++){
            if(roles[j].siteNo==sites[i].siteNo){
                $("#select2_modal").append("<option value=\""+roles[j].id+"\">"+roles[j].role+"</option>");
            }
        }
        $("#select2_modal").append("</optgroup>");
    }

    if(op=='update'){
        $('#edit_form').attr("action","/user/"+userId+"/update");
        var roleIds=[[${user.roleIds}]];
        var locked=[[${user.locked}]];
        if(roleIds.length>0){
            var roles=roleIds.split(",");
            for(var i=0;i<roles.length;i++){
                $("option[value='"+roles[i]+"']").attr("selected",true);
            }
        }
        if(locked){
            $('#lock_l').attr('checked',true);
        }else{
            $('#lock_u').attr('checked',true);
        }
    }
    /*]]>*/
</script>
</body>
</html>